<template>
  <div id="stopdialog">
    <commonformdialog
      :isshowDialogs="isshowDialog"
      :isshowconfirmbtn="false"
      :dialogWidth="'35%'"
      :enterTitle="false"
      :isshowimportTitle="false"
      :dialogTitle="`终止建档-${titlename}`"
      @closetextDialog="closetextDialog"
      @confirmbtn='confirmbtn'
      :topHeight='"25vh"'
    >

   <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="80px">
  <el-form-item label="选择原因" prop="reason">
    <el-select v-model="formData.reason" placeholder="选择终止原因" clearable :style="{width: '100%'}">
      <el-option v-for="(item, index) in stopOption" :key="index" :label="item.title" :value="item.id"
        :disabled="item.disabled"></el-option>
    </el-select>
  </el-form-item>
  <el-form-item label="退款金额" prop="refund">
    <el-input v-model="formData.refund" placeholder="请输入退款金额" clearable :style="{width: '100%'}">
        <template slot="append">元</template>
    </el-input>
  </el-form-item>
</el-form>


    </commonformdialog>
  </div>
</template>

<script>
//引入弹窗
import commonformdialog from '@/components/commondialog/commondialog'
import {getSessionStorage} from '@/utils/accessToken'
//api
import {studentrecord} from '@/api/student'
export default {
  data() {
    return {
      //标题名字
      titlename:'',
      //学员id
      studentId:'',
      formData: {
        reason: '',
        refund: '',
      },
      rules: {
        reason: [{
          required: true,
          message: '请选择原因',
          trigger: 'change'
        }],
        refund: [{
          required: true,
          message: '请输入退款金额',
          trigger: 'blur'
        }],
      },
      stopOption: [{
        "label": "建档失败",
        "value": 1
      }, {
        "label": "学员自主",
        "value": 2
      }, {
        "label": "其他",
        "value": 3
      }],
    }
  },
  components: {
    commonformdialog,
  },
  props: {
    //是否显示弹窗
    isshowDialog: {
      type: Boolean,
      default: false,
    },
    dialogparams:{
      type:Object,
      default:()=>{
        return {}
      }
    }
  },
  methods:{
      //关闭弹窗
    closetextDialog() {
      this.$refs['elForm'].resetFields()
      this.$emit('closetextDialog')
    },
    //点击确认
    confirmbtn(){
        this.$refs['elForm'].validate(async valid => {
        if (!valid) return
        let params = {
          student_id:this.studentId,
          type:3,
          reason:this.formData.reason,
          refund:this.formData.refund,
          _request:3
        }
        let data = await studentrecord(params)
        if(data.code=='0000'){
          this.$message.success('终止成功！')
          this.$emit('confirm')
          //清空数据
          this.$refs['elForm'].resetFields()
        }

      })

    }
  },
  mounted(){
      //获取暂缓建档数据
      this.stopOption = getSessionStorage('Options')[24]
  },
  watch:{
    dialogparams(val){
      this.titlename = val.name
      this.studentId = val.id
    }
  }
}
</script>

<style scoped lang='scss'>

</style>
